//
//  ChangeColorView.swift
//  ShouChong
//
//  Created by yw on 2024/8/27.
//

import SwiftUI

struct ChangeColorView: View {
    
    struct ColorModel:Identifiable {
        var id:String = UUID().uuidString
        var name:String
        var value:String
        var isVIP:Bool = false
    }
    
    @Environment(\.presentationMode) var mode;
    
    @AppStorage("curren_main_color") var currentMainColor = "color_main_01"
    let gridItem:[GridItem] = [
        GridItem(.flexible(minimum: 60, maximum: 80), spacing: 30, alignment: .center),
        GridItem(.flexible(minimum: 60, maximum: 80), spacing: 30, alignment: .center),
        GridItem(.flexible(minimum: 60, maximum: 80), spacing: 30, alignment: .center),
    ]
    @State private var colorList:[ColorModel] = [
        ColorModel(name: "蓝色", value: "color_main_01"),
        ColorModel(name: "粉色", value: "color_main_02"),
        ColorModel(name: "绿色", value: "color_main_03"),
        ColorModel(name: "橘色", value: "color_main_04"),
        ColorModel(name: "紫色", value: "color_main_05"),
        ColorModel(name: "红色", value: "color_main_06"),
        ColorModel(name: "灰球麒麟色", value: "color_main_07",isVIP: true),
        ColorModel(name: "巧克力色", value: "color_main_08",isVIP: true),
        ColorModel(name: "熔岩橙", value: "color_main_09",isVIP: true),
        ColorModel(name: "宝石绿", value: "color_main_10",isVIP: true),
        ColorModel(name: "紫罗兰", value: "color_main_11",isVIP: true),
    ]
    @AppStorage("k_luleme_vip") var lulemeVIP:Bool = false
    @State var showVIP:Bool = false
    var body: some View {
        ScrollView {
            HStack {
                Spacer()
                ShakeButton(label:
                                Image(systemName: "xmark")
                    .foregroundColor(Color("color_gray"))
                            
                ) {
                    mode.wrappedValue.dismiss()
                }.modifier(MainTextModifier(fontWeight: .bold))
                    .padding(.horizontal,20)
                    .padding(.vertical,10)
            }
            .padding(.top,12)
            LazyVGrid(columns: gridItem,spacing: 20,content: {
                ForEach(colorList) {item in
                    RoundedRectangle(cornerRadius:20)
                        .fill(Color(item.value))
                        .frame(width: 80,height: 80)
                        .overlay(alignment: .bottom, content: {
                            Text(item.name)
                                .modifier(MainTextModifier(fontSize: 12, fontWeight: .medium, foreColor: Color("color_white")))
                                .offset(y:-10)
                        })
                        .overlay(alignment: .topTrailing, content: {
                            if item.isVIP {
                                Image("icon_vip")
                                    .resizable()
                                    .aspectRatio(contentMode: .fill)
                                    .frame(width: 16, height: 16)
                                    .offset(x:-6,y:6)
                            }
                            
                        })
                        .overlay(alignment:.bottomTrailing) {
                            if item.value == currentMainColor {
                                Image(systemName: "checkmark.circle.fill")
                                    .foregroundColor(.white)
                                    .offset(x:-6,y: -6)
                            }
                        }.onTapGesture {
                            let generator = UIImpactFeedbackGenerator(style: .light)
                            generator.prepare()
                            generator.impactOccurred()
                            if lulemeVIP  {
                                currentMainColor = item.value
                            } else {
                                if item.isVIP {
                                    showVIPView()
                                } else {
                                    currentMainColor = item.value
                                }
                            }
                            
                        }
                }
                
            })
            .padding(.top,10)
            .padding(.bottom,20)
        } .background(Color("color_bg"))
            .sheet(isPresented: $showVIP, content: {
                VIPView()
            })
    }
    
    private func showVIPView() {
        showVIP.toggle()
        
    }
}


